import { ref, shallowRef } from 'vue'
import { defineStore, acceptHMRUpdate } from 'pinia'

export const usePageTabStore = defineStore('pageTab', () => {
  // 活跃tab
  const editableTabs = ref([])
  // const temp = [{
  //   title: '标签标题',
  //   name: '标签名称',
  //   router: {}
  // }]
  // 当前tab
  const editableTabsValue = ref('')
  // 当前缓存tab
  const cachedComponents = ref([])
  // 用来存已经创建的组件
  const wrapperMap = shallowRef(new Map())

  // 初始化
  function load(tabs, nowTab, cachedtabs) {
    editableTabs.value = tabs
    editableTabsValue.value = nowTab
    cachedComponents.value = cachedtabs
  }
  // 添加tag
  function add(title, name) {
    // // 第一次添加
    // if (editableTabs.value.length === 0) {
    //   editableTabs.value.push({ title, name })
    //   // 设置当前活跃tab
    //   editableTabsValue.value = name
    //   return
    // }
    // 判断是否添加
    const nowTab = editableTabs.value.find((item) => item.name === name)
    if (nowTab) {
      // 设置当前活跃tab
      editableTabsValue.value = nowTab.name
    } else {
      editableTabs.value.push({ title, name })
      // 设置当前活跃tab
      editableTabsValue.value = name
    }
  }
  // 删除tag
  function del(name) {
    // 判断是否最后一个tab
    if (editableTabs.value.length == 1) return
    // 判断删除tab是否当前tab
    if (name === editableTabsValue.value) {
      // 重新排序
      editableTabs.value.forEach((tab, index) => {
        if (tab.name === name) {
          let tab = editableTabs.value[index + 1] || editableTabs.value[index - 1]
          editableTabsValue.value = tab.name
        }
      })
    }
    // 过滤删除tab
    editableTabs.value = editableTabs.value.filter((tab) => tab.name != name)
  }

  // 清除
  function clear() {
    editableTabs.value = []
    editableTabsValue.value = ''
    cachedComponents.value = []
  }

  return { editableTabs, editableTabsValue, cachedComponents, wrapperMap, add, del, load, clear }
})
// 确保传递正确的 store 声明，本例中为 `useAuth`
if (import.meta.hot) {
  import.meta.hot.accept(acceptHMRUpdate(usePageTabStore, import.meta.hot))
}
